<template>
    <div class="SingerInfoD">
        <div class="SingerInfoD_a">
            <h2>简介</h2>
            <p>{{introduceAList}}</p>
        </div>
        <div class="SingerInfoD_b" v-for="(v,i) in introduceBList" :key="i">
            <h2 v-html="v.ti"></h2>
            <p v-html="v.txt.replace(/\n/g,'<br>')"></p>
        </div>
    </div>
</template>
<script>
import axios from 'axios'
export default {
    data () {
        return {
            introduceAList:{},
            introduceBList:{},
        }
    },
    methods: {
        getintroduceList(){
            axios.get(`http://127.0.0.1:3000/artist/desc?id=${this.$route.params.id}`).then((res)=>{
                this.introduceAList =res.data.briefDesc;
                this.introduceBList =res.data.introduction;
            })
        },


    },
    created () {
        this.getintroduceList()
    }
}
</script>

<style scoped>
.SingerInfoD{
   margin-top: 20px;
}
.SingerInfoD>.SingerInfoD_a>h2{
    border-left: 5px solid #c10d0c;
    font-size: 14px;
    padding-left: 10px;
    margin-bottom: 8px;
}
.SingerInfoD>.SingerInfoD_a>p{
    font-size: 12px;
    color: #666666;
    text-indent: 2em;
    line-height: 25px;
}
.SingerInfoD>.SingerInfoD_b{
    margin-top: 28px;
}
.SingerInfoD>.SingerInfoD_b>h2{
    font-size: 14px;
    margin-bottom: 8px;
}
.SingerInfoD>.SingerInfoD_b>p{
    font-size: 12px;
    color: #666666;
    line-height: 25px;
}
</style>